<template>
	<view class="u-page">
		<u-steps :current="current">
			<u-steps-item title="安全交底"></u-steps-item>
			<u-steps-item title="工程质量"></u-steps-item>
			<u-steps-item title="进度阶段"></u-steps-item>
			<u-steps-item title="工程量"></u-steps-item>
			<u-steps-item title="其他"></u-steps-item>
		</u-steps>
		<u--form v-if='current==0' :borderBottom='true' labelPosition='top' labelWidth='auto' :model="formState"
			name="basic" layout="horizontal">

			<u-form-item :borderBottom='true' label="1 开工前是否已进行安全交底" prop="name">
				<u-radio-group v-model="CheckJsonArr[0]">
					<u-radio label="是" name="1" checked>
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="2 已提交现场出工人员合照" prop="name">
				<u-radio-group v-model="CheckJsonArr[1]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="3 已提交现场施工照片" prop="name">
				<u-radio-group v-model="CheckJsonArr[2]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="4 已收工现场照片" prop="name">
				<u-radio-group v-model="CheckJsonArr[3]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
		</u--form>
		<u--form v-if='current==1' :borderBottom='true' labelPosition='top' labelWidth='auto' :model="formState"
			name="basic" layout="horizontal">

			<u-form-item :borderBottom='true' label="1 是否符合施工图设计要求" prop="name">
				<u-radio-group v-model="CheckJsonArr[4]">
					<u-radio label="是" name="1" checked>
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="2 电源线、传输线、告警线正确连接" prop="name">
				<u-radio-group v-model="CheckJsonArr[5]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="3 布线合理整齐，无裸露、交叉、飞线" prop="name">
				<u-radio-group v-model="CheckJsonArr[6]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="4 机架内部和机架之间的所有连线、插头都贴有标签" prop="name">
				<u-radio-group v-model="CheckJsonArr[7]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="5 设备安装位置严格按照设计方案执行" prop="name">
				<u-radio-group v-model="CheckJsonArr[8]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="6 设备已按规范要求做好接地" prop="name">
				<u-radio-group v-model="CheckJsonArr[9]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="7 户外光电缆接头用防水胶泥、胶布包扎，无松动，表面整齐密封，包扎符合规范要求" prop="name">
				<u-radio-group v-model="CheckJsonArr[10]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="8 尾纤外观应无损伤，尾纤必须套管保护，不得直接裸露在室外" prop="name">
				<u-radio-group v-model="CheckJsonArr[11]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>

		</u--form>
		<u--form v-if='current==2' :borderBottom='true' labelPosition='top' labelWidth='auto' :model="formState"
			name="basic" layout="horizontal">

			<u-form-item :borderBottom='true' label="1 领料进场" prop="name">
				<u-radio-group v-model="CheckJsonArr[12]">
					<u-radio label="是" name="1" checked>
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="2 实施主体工程" prop="name">
				<u-radio-group v-model="CheckJsonArr[13]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="3 工程完工" prop="name">
				<u-radio-group v-model="CheckJsonArr[14]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="4 整理资料" prop="name">
				<u-radio-group v-model="CheckJsonArr[15]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item :borderBottom='true' label="5 工程验收" prop="name">
				<u-radio-group v-model="CheckJsonArr[16]">
					<u-radio label="是" name="1">
					</u-radio>
					<u-radio label="否" name="0">
					</u-radio>
				</u-radio-group>
			</u-form-item>


		</u--form>
		<u--form v-if='current==3' :borderBottom='true' labelPosition='left' labelWidth='auto' :model="formState">

			<u-form-item :borderBottom='true' label="附挂杆路长度(米)" prop="name">
				<u-input v-model="formState.Num1" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="附挂钢纹线长度(米)" prop="name">
				<u-input v-model="formState.Num2" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="附挂光缆(米)" prop="name">
				<u-input v-model="formState.Num3" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="新建杆路长度(米)" prop="name">
				<u-input v-model="formState.Num4" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="立杆数(根)" prop="name">
				<u-input v-model="formState.Num5" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="直埋线路长度(米)" prop="name">
				<u-input v-model="formState.Num6" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="熔纤数量(根)" prop="name">
				<u-input v-model="formState.Num7" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="安装交接箱数量(个)" prop="name">
				<u-input v-model="formState.Num8" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="安装分纤箱数量(个)" prop="name">
				<u-input v-model="formState.Num9" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="皮缆安装(户)" prop="name">
				<u-input v-model="formState.Num10" border="none"></u-input>
			</u-form-item>
			<u-form-item :borderBottom='true' borderBottom label="其他施工项" prop="name">
				<u-textarea v-model="formState.Other" ></u-textarea> 
			</u-form-item>
			</u--form>
		<u--form v-if='current==4' labelPosition='top' labelWidth='700rpx' :model="formState" name="basic"
			layout="horizontal" :labelCol="{span:7}" :wrapperCol="{span: 13, offset: 0}">
			<u-form-item :borderBottom='true' borderBottom label="存在问题(需要协调)" prop="name">
				<u-textarea v-model="formState.Wrong" ></u-textarea> 
			</u-form-item>
			<u-collapse :value="['1','2','3','4']">
				<u-collapse-item name="1" title="工程施工日志照片" icon="https://cdn.uviewui.com/uview/example/image.png">
					<u-upload :sizeType='["compressed"]' :fileList="fileList1" @afterRead="afterRead"
						@delete="deletePic" name="1" multiple :maxCount="10"></u-upload>
				</u-collapse-item>
				<u-collapse-item name="2" title="主要施工环节与隐蔽工程照片" icon="https://cdn.uviewui.com/uview/example/image.png">
					<u-upload :sizeType='["compressed"]' :fileList="fileList2" @afterRead="afterRead"
						@delete="deletePic" name="2" multiple :maxCount="10"></u-upload>
				</u-collapse-item>
				<u-collapse-item name="3" title="地址" icon="https://cdn.uviewui.com/uview/example/image.png">
					<u--text margin="0 0 8px 0" type="info" prefixIcon="map" :text="formState.Addr">
					</u--text>
				</u-collapse-item>
			</u-collapse>
		</u--form>
		<u-button type="primary" text="上一步" v-if="current!=0" :plain="true" @click="current=current-1"></u-button>
		<u-button type="primary" text="下一步" v-if="current!=4" @click="current=current+1"></u-button>
		<u-button type="primary" text="提交" v-if="current==4" @click="save"></u-button>
		<u-notify ref="uNotify"></u-notify>
		<u-loading-page :loading="loading" loading-text="正在定位" bg-color='rgba(0, 0, 0, 0.3)'></u-loading-page>
	</view>
</template>

<script>
	import coordtransform from 'coordtransform'
	import {
		baseUrl
	} from '@/common/config.js'
	import {
		mapGetters
	} from 'vuex'

	import {
		getbuildlist,
		addbuilddaily,
		addtempdaily,
		GetAddrByLatlng
	} from '@/common/api.js'
	export default {
		data() {
			return {
				CheckJsonArr: [],
				CheckJson: '11111111111111111',
				current: 0,
				loading: false,
				itypelist: {
					"1": "工程施工日志照片",
					"2": "主要施工环节与隐蔽工程照片",
				},
				user:null,
				token:null,
				// Addr:"",
				formState: {
					Addr: ""
				},
				fileList1: [],
				fileList2: [],
				buildid: null,
				id: null,
				notifyData: {
					message: '保存成功',
					type: 'success',
					color: '#ffffff',
					bgColor: '',
					fontSize: 15,
					duration: 3000,
					safeAreaInsetTop: false
				},
			}
		},
		onLoad(option) {
			this.user = JSON.parse(uni.getStorageSync("$userinfo"))
			this.token = uni.getStorageSync("$token")
			this.CheckJsonArr= this.CheckJson.split('')
			if(option.buildid){
				this.buildid = option.buildid
			}
			this.outlocation()
			if (option.id)
				this.getdate(option.id)
		},
		computed: {
			...mapGetters(['user']),
		},
		methods: {
			outlocation() {

				uni.getLocation({
					type: 'wgs84',
					geocode: true, //设置该参数为true可直接获取经纬度及城市信息
					success: (res) => {
						console.log("定位结果" + res.longitude + "，" + res.latitude)
						// that.addrDel = res;
						this.outcenter = [res.longitude, res.latitude]
						//  this.outcenter = [parseFloat(res.longitude), parseFloat(res.latitude)]
						// this.outcenter = [111.11111, 11.111111]
						// this.view.goTo({
						// 	center: [res.longitude, res.latitude],
						// 	zoom: 15
						// });
						// this.outcenter = [119,24]
						// console.log(res.longitude)
						this.formState.Latlng = res.latitude + ',' + res.longitude
						var gcj02 = coordtransform.wgs84togcj02(res.longitude, res.latitude)
						console.log(gcj02);
						GetAddrByLatlng(gcj02[1] + "," + gcj02[0]).then(res2 => {
							console.log(res2);
							this.formState.Addr = res2;
							// this.Addr=res2

						})


						// this.formState.Addr = res2.result.formatted_addresses
						this.loading = false
					},
					fail: () => {
						// this.outcenter = [111.11111, 11.111111]
						// console.log("定位结果失败")
						// console.log(this)
						uni.showToast({
							title: '获取地址失败，将导致部分功能不可用',
							icon: 'none'
						});
					}
				});
				// this.outcenter = [119,24]
			},
			save() {
				this.formState.CheckJson = this.CheckJsonArr.join('')
				if(this.buildid == null){
					addtempdaily(this.formState).then(res => {
						this.$refs.uNotify.show(this.notifyData)
						uni.setStorageSync("changed", "1")
						uni.navigateBack()
						// uni.switchTab({
						// 	url: "/pages/index/buildimages"
						// })
					})
				}else{
					this.formState.Buildid = this.buildid
					addbuilddaily(this.formState).then(res => {
						this.$refs.uNotify.show(this.notifyData)
						uni.setStorageSync("changed", "1")
						uni.navigateBack()
						// uni.switchTab({
						// 	url: "/pages/index/buildimages"
						// })
					})
				}
			},
			getdate(id) {
				getbuilddailybyid(id).then(res => {
					this.formState = res.data
				})
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url, this.itypelist[event.name])
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url, itype) {
				// console.log(this.user.Id)
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: `${baseUrl}/SysFile/upload?outid=${this.formState.Id||this.user.Id}&type=${itype}`,
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						header: {
							"Authorization": `Bearer ${this.token}`
						},
						success: (res) => {
							setTimeout(() => {
								resolve(res.data.data)
							}, 1000)
						}
					});
				})
			},
		}
	}
</script>

<style>

</style>
